<script setup lang="ts">
import { reactive } from 'vue';

const state =reactive({
  name:'clove',
  title:'butterfly',
  titles:['favorite']
})

const addtitle=()=>{
  state.titles.push('favorite2')
}
</script>

<template>
<h1>{{ state.name }}</h1>
<h1 @click="state.title += '!'">{{ state.title }}</h1>
<h1 @click="addtitle">{{ state.titles }}</h1>



</template>

<style scoped></style>
